<!-- 引入下拉刷新插件 -->
<link rel="stylesheet" href="/assets/home/plugins/mescroll/mescroll.min.css" />
<script src="/assets/home/plugins/mescroll/mescroll.min.js"></script>

<!-- 引入异步请求工具 -->
<script src="/assets/home/plugins/axios/axios.min.js"></script>
<script src="/assets/home/plugins/axios/request.js"></script>

<link href="/assets/home/css/order.css" rel="stylesheet" />
<!-- 头部 -->
<div class="top_div" style="background-image: url('/assets/home/images/bac.jpg');">
    <!-- <img src="/assets/home/images/bac.jpg" class="top_img"> -->
    <div class="userInfo">
        {if !empty($business['avatar'])}
        <img class="uPic" src="{$business['avatar']}" /><br />
        {else /}
        <img class="uPic" src="/assets/home/images/avatar.jpg" /><br />
        {/if}

        <span class="uBalance">{$business['nickname']}</span>
    </div>
</div>

<!-- tab页切换 -->
<div class="page__bd">
    <div class="weui-tab">
        <div class="weui-navbar">
            <div class="weui-navbar__item weui-bar__item_on">
                用户消费记录
            </div>
            
        </div>
        <div class="weui-tab__panel">
            <div id="recordlist" class="o1 mescroll">
                <div class="li"></div>
            </div>
        </div>
    </div>
</div>

<script>
    // 时间戳转为标准时间
    function formatTime(timestamp) {
        var date = new Date(timestamp * 1000);//时间戳为10位需*1000，时间戳为13位的话不需乘1000
        var Y = date.getFullYear() + '-';
        var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
        var D = date.getDate() + ' ';
        var h = date.getHours() + ':';
        var m = date.getMinutes() > 9 ? date.getMinutes() + ':' : '0' + date.getMinutes() + ':';
        var s = date.getSeconds();
        return Y + M + D + h + m + s;
    }

    var page = 1;//当前页
    var limit = 3;//每页查询多少条
    var busid = `{$business.id}`;
    console.log(busid);
    //下拉刷新和上拉加载配置
    var scroll = new MeScroll('recordlist', {
        down: {
            auto: false, //是否在初始化完毕之后自动执行下拉回调callback; 默认true
            callback: DownCallback //下拉刷新的回调
        },
        up: {
            auto: true, //是否在初始化时以上拉加载的方式自动加载第一页数据; 默认false
            callback: UpCallback, //上拉回调,此处可简写
            page: {
                size: limit
            },
            toTop: { //配置回到顶部按钮
                duration: 300,
                src: "/assets/home/plugins/mescroll/mescroll-totop.png", //默认滚动到1000px显示,可配置offset修改
                offset: 100
            },
            htmlNodata: '<div class="more">没有更多了..</div>',
        }
    })

    // 下拉刷新回调
    function DownCallback() {
        scroll.resetUpScroll()
        $('#recordlist .li').empty()
    }

    // 上拉刷新回调
    async function UpCallback(current) {
        //当前页码值
        page = current.num
        limit = current.size

        //组装数据
        var data = {
            page: page,
            limit: limit,
            busid: busid,
        };

        var result = await POST({
            // url: '/home/subject/record',
            url: 'https://xw.520team.cn/home/subject/record',
            params: data
        })

        console.log(result);
        // return false;

        if (result.code == 0) {
            // 暂无更多数据
            var temp = `<div class="weui-form-preview">
                    <div class="weui-form-preview__hd" style="text-align: center;">
                        暂无消费记录
                    </div>
                </div>`
            $('#recordlist .li').append(temp)
            // mui.toast(result.msg, { duration: 1000 })
            scroll.endBySize(0, 0)
            return false
        }

        var list = result.data.list
        //设置上拉加载状态
        scroll.endBySize(list.length)
        FetchList(list)
    }
    function FetchList(list) {
        for (var item of list) {
            var temp = `<div class="weui-form-preview">
                    <div class="weui-form-preview__hd">
                        <div class="weui-form-preview__item">
                            <label class="weui-form-preview__label">消费金额</label>
                            <em class="weui-form-preview__value">¥${item['total'].replace('-', '')}</em>
                        </div>
                    </div>
                    <div class="weui-form-preview__bd">
                        <div class="weui-form-preview__item">
                            <label class="weui-form-preview__label">消费描述</label>
                            <span class="weui-form-preview__value">${item['content']}</span>
                        </div>
                        <div class="weui-form-preview__item">
                            <label class="weui-form-preview__label">消费时间</label>
                            <span class="weui-form-preview__value">${formatTime(item['createtime'])}</span>
                        </div>
                    </div>
                </div><br>`
            $('#recordlist .li').append(temp)
        }
    }
</script>